From b24748777294b3646e67c4b7e599e032ee1dfcf9 Mon Sep 17 00:00:00 2001
From: Mitchell Riedstra <mitch@riedstra.dev>
Date: Sun, 1 Jan 2023 20:09:47 -0500
Subject: Start of Svelte UI

---
 ui/src/routes/view/[id]/+page.js     | 15 +++++++++
 ui/src/routes/view/[id]/+page.svelte | 63 ++++++++++++++++++++++++++++++++++++
 2 files changed, 78 insertions(+)
 create mode 100644 ui/src/routes/view/[id]/+page.js
 create mode 100644 ui/src/routes/view/[id]/+page.svelte

(limited to 'ui/src/routes/view/[id]')

diff --git a/ui/src/routes/view/[id]/+page.js b/ui/src/routes/view/[id]/+page.js
new file mode 100644
index 0000000..a7af895
--- /dev/null
+++ b/ui/src/routes/view/[id]/+page.js
@@ -0,0 +1,15 @@
+
+
+
+
+/** @type {import('./$types').PageLoad} */
+export async function load({ params }) {
+   const req = await fetch(`/api/v1/view/${params.id}`) 
+    const reqJson = await req.json();
+
+  return {
+    id: params.id,
+    req: req,
+    reqJson: reqJson,
+  };
+}
\ No newline at end of file
diff --git a/ui/src/routes/view/[id]/+page.svelte b/ui/src/routes/view/[id]/+page.svelte
new file mode 100644
index 0000000..0fc865f
--- /dev/null
+++ b/ui/src/routes/view/[id]/+page.svelte
@@ -0,0 +1,63 @@
+
+<script>
+    let id = "";
+    
+    /** @type {import('./$types').PageData} */
+    export let data;
+
+    console.log(data);
+    
+    
+  let msg = "";
+  let copyPromise = null;
+  let timer = 0;
+  
+  function copy() {
+    copyPromise = navigator.clipboard.writeText(data.reqJson.Content);
+    timer = 3;
+    setTimeout(function() {
+      for (; timer >= 0 ; timer --);
+      return
+    }, 1000)
+  }
+</script>
+
+<h2>ID: {data.id}</h2>
+
+{#if timer > 0}
+{#await copyPromise}
+{:then}
+  <p>
+    Successfully copied!
+  </p>
+{:catch error}
+  <p>
+    Failed to copy: {error}
+  </p>
+{/await}
+{/if}
+
+<button on:click={copy}>Copy to clipboard!</button>
+
+<pre id="content" class="code">{data.reqJson.Content}</pre>
+
+
+<style>
+/* TODO: Figure out why the styles don't get propagated down here
+ from the +layout up above */
+.code {
+  color: #000;
+  background-color: #FFFFEA;
+  display: block;
+  padding: 10px;
+  border: 1px solid;
+  line-height: 1.1;
+  overflow: auto;
+  border: 1px solid;
+  padding: 2px;
+  font-size: .8em;
+  font-family: "Roboto Mono", "Monaco", "Lucida Console", "DejaVu Sans Mono", "monospace";
+}
+
+
+</style>
\ No newline at end of file
-- 
cgit v1.2.3